<html>
	<head>
		<meta charset="utf-8">
		<script type="text/javascript" src="./vue.min.js"></script>
		<script type="text/javascript" src="./index.js"></script>
    <style type="text/css">
      body{
        background: #eee;
      }
      .words {
        display: block;
        width: 100%;
        height: 90px;
        margin: 50px auto;
        font-size: 2.25rem;
      }
      input[type=number] {  
          -moz-appearance:textfield;  
      }  
      input[type=number]::-webkit-inner-spin-button,  
      input[type=number]::-webkit-outer-spin-button {  
          -webkit-appearance: none;  
          margin: 0;  
      }
    </style>
	</head>
	<body>
		<div id="app">
			<x-words class="words" :size="6" v-model="code" @full="log" />
		</div>	
		<script type="text/javascript">
			var vm = new Vue({
				el: '#app',
				data: {
					code: ''
				},
				methods: {
					log: function() {
						console.log(this.code);
					}
				}
			});
		</script>
	</body>
</html>